<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
		<title>Mandelbrot</title>
		<script type="text/javascript" src="tgd/Math/Mandelbrot.js"></script>
		<script type="text/javascript" src="tgd/Math/Views/DOMMandelbrot.js"></script>
		<script type="text/javascript" src="tgd/Math/Views/CanvasMandelbrot.js"></script>
		<script type="text/javascript" src="tgd/Utilities/Throbber.js"></script>
		<style type="text/css">
			html,body{width:100%;height:100%;background:#000;margin:0;font-size:1em;color:#fff;}
			#menu{position:fixed;top:0;right:0;font-size:.7em; color:#fff;}
			.mandelbrot{margin:0 auto;background:#0f0;}
			.pixel{height:1px;width:1px;float:left;font-size:0;line-height:0;}
			input{font-size:1em;border:none;padding:0;margin:0;}
			.throbber{font-size:2em;width:1em;height:1em;padding:.25em;font-weight:bold;text-align:center;border:solid 1px #00f;color:#0f0;font-family:'OCR A Extended',Calibri;}
		</style>

		<script type="text/javascript">
			//<![CDATA[

			var mandelbrot;
			var throbber;
			var body;

			function init() {
				body = document.getElementById("body");
				throbber = new tgd.Utilities.Throbber();
				document.getElementById('txtSize').focus();
			}

			function generate(dimension) {
				body.appendChild(throbber.getCanvas());
				throbber.start();

				mandelbrot = new tgd.Math.Mandelbrot(dimension, function() {
					throbber.toggle();

					var renderView = function() {
						if (navigator.userAgent.indexOf('MSIE') != -1) {
							view = new tgd.Math.Views.DOMMandelbrot(mandelbrot, document.getElementById("dom"), function() {
								throbber.stop();
								body.removeChild(throbber.getCanvas());
							});  //IE
						} else {
							view = new tgd.Math.Views.CanvasMandelbrot(mandelbrot, document.getElementById("cvs"));  //NOT IE
						}
					}

					setTimeout(renderView, 8);
				});
			}

			//]]>
		</script>
	</head>
	<body id="body" onload="init();">
		<div id="menu">
			<label for="txtSize">Size: </label>
			<input id="txtSize" type="text" maxlength="4" size="3" onkeyup="if (event.keyCode == 13) { generate(this.value); }" />
			<input type="button" value="Run" onclick="generate(parseInt(document.getElementById('txtSize').value));" />
		</div>
		<div id="dom" class="mandelbrot"></div>
		<canvas id="cvs">Your browser is worthless.</canvas>
	</body>
</html>
